import React, { Component, useState, useEffect } from 'react';
import { ListView, Button, Toast, PullToRefresh } from 'antd-mobile';
import 'antd-mobile/dist/antd-mobile.css';
import http from "../../model/http";

export default function Test() {

    const [el, setEl] = useState({})
    const [refreshing, setRefreshing] = useState(false)
    const [list, setList] = useState([
        1, 2, 3, 4, 5, 6, 7, 8, 9
    ])

    //这下面的代码跟官网没啥区别，唯一不同的是把外部定义的数据都保存进了
    return (
        <div>
            <PullToRefresh
                damping={60}
                // ref={el => this.ptr = el}
                style={{
                    height: 200,
                    overflow: 'auto',
                    backgroundColor: 'red',
                    paddingTop: 10

                }}
                indicator={{ deactivate: '上拉可以刷新' }}
                direction={'down'}
                refreshing={refreshing}
                onRefresh={() => {
                    setRefreshing(true)
                    setTimeout(() => {
                        setRefreshing(false)
                    }, 1000);

                }}
            >
                {list.map(i => (
                    <div key={i} style={{ textAlign: 'center', padding: 20 }}>
                        {i}
                    </div>
                ))}
            </PullToRefresh>
            <div>123</div>
        </div>
    );
}
